<template>
    <div>
        <component :is="one"></component>

        <div id="containerpic">
            <div id="content">
                <h2><strong>欢迎使用第四组项目申报系统 </strong></h2>
                <h2><small>本页面仅用于管理员登陆</small></h2>


                <div class="splitcontentleft">
                    <div id="subcontent">
                        <form action="" method="post" id="form">
                            <div class="small box">
                                <table id="app" width="150" border="0" cellspacing="0" cellpadding="0">
                                    <tr>
                                        <td width="30%" valign="middle"><img src="images/username.jpg" width="61"
                                                height="17" align="bottom" />
                                            <input name="username" id="username" v-model="username" type="text"
                                                size="7" />
                                        </td>
                                    </tr>
                                    <tr>
                                        <td valign="middle"><img src="images/password.jpg" width="61" height="17" />
                                            <input name="password" id="password" v-model="password" type="password"
                                                size="7" />
                                        </td>
                                    </tr>
                                    <tr>
                                        <td>
                                          <img src="images/login_1_7.jpg" width="61" height="17" type="button" @click="login()" value="请登录"/>
<!--                                            <input type="button" @click="login()" value="请登录"/>-->
                                        </td>

                                    </tr>
                                </table>
                            </div>
                        </form>
                    </div>
                    <p>&nbsp;</p>

                </div>
            </div>

        </div>
        <component :is="two"></component>
    </div>
</template>
<script>
    import four from '../../util/four';
    import aaa from '../../components/header.vue'
    import bbb from '../../components/footer.vue'
    export default {
        components: {
            aaa, bbb
        },
        data() {
            return {
                one: 'aaa',
                two: 'bbb',
                username: "",
                password: "",
            }
        },
        methods: {
            login() {
                four.get("/users/" + this.username + "/" + this.password).then((res) => {//发送一个get请求
                    if (res.data.code == 20040) {
                        this.$message.error("登录失败！用户名或密码错误！");
                    }
                    //登录成功
                    if (res.data.code == 20041) {
                        //将uid存入session
                        sessionStorage.setItem("userid", JSON.stringify(res.data.data.uid));
                        sessionStorage.setItem("username", JSON.stringify(this.username));
                        //管理员登录
                        if (res.data.data.gid == "1") {
                            this.$router.push('/admin');
                        }
                        //专家登录
                        if (res.data.data.gid == "2") {
                            this.$router.push('/expert');
                        }
                        //普通用户登录
                        if (res.data.data.gid == "3") {
                            this.$router.push('/unit');
                        }
                    }
                })
            },
        },
    }
</script>